<template>
  <div class="ma-content-block lg:flex justify-between p-4">
    <!-- CRUD 组件 -->
    <ma-crud :options="options" :columns="columns" ref="crudRef">
      <template #beforeTable>
        <slot name="tableButtons">
          <a-button v-for="button in buttonGroupsAfter" style="margin-right: 10px;"
          @click="batchActionRef.open(button)" type="secondary"
          class="w-full lg:w-auto mt-2 lg:mt-0"
            >
              {{ button.title }}
            </a-button>
      </slot>
      </template>
      <template #tableButtons>
        <slot name="tableButtons">
        <a-button
        v-if="options.add.show"
        v-auth="options.add.auth || []"
        v-role="options.add.role || []"
        @click="addAction(1,1)" type="primary"
        class="w-full lg:w-auto mt-2 lg:mt-0"
          >
            <template #icon>
              <icon-plus/>
            </template>
            {{ '客户充值' }}
          </a-button>
      </slot>
        <slot name="tableButtons">
        <a-button
        v-if="options.add.show"
        v-auth="options.add.auth || []"
        v-role="options.add.role || []"
        @click="addAction(5,3)" type="primary"
        class="w-full lg:w-auto mt-2 lg:mt-0"
          >
            <template #icon>
              <icon-plus/>
            </template>
            {{ '支付供应商' }}
          </a-button>
      </slot>
      <template v-for="button in buttonGroups">
        <a-button v-if="!button.children" type="primary" size="small" @click="button.action" :status="button.status?button.status:'default'">{{button.title}}</a-button>
        <a-dropdown trigger="hover" :popup-max-height="false" v-else>
          <a-button size="medium" type="primary" >
            {{button.title}}
            <template #icon>
              <icon-down/>
            </template>
          </a-button>
          <template #content>
            <a-doption v-for="buttonChild in button.children" @click="buttonChild.action">{{ buttonChild.title }}</a-doption>
          </template>
        </a-dropdown>
        <download url="finance/financialStatement/export" type="financialStatement" :auth="['finance:financialStatement:export']"/>
      </template>
    </template>
    </ma-crud>
    <batch-action-modal v-model="batch.visible"
    :crud-ref="crudRef"
    :selected="selected"
    ref="batchActionRef"
    ></batch-action-modal>
  </div>
</template>
<script setup>
import { ref, reactive ,computed,provide} from 'vue'
import financialStatement from '@/api/finance/financialStatement'
import BatchActionModal from "@cps/actions/batchActionModal.vue";
import dicthelper from "@/utils/dicthelp.js";
import Download from "@/views/components/download.vue";

const crudRef = ref()
const batchActionRef = ref()
const batch = ref({visible:false,})
const selected = computed(()=>crudRef.value?.selecteds)
const userShow = ref(false)
const stateType = ref(true)
const tradeType = ref(0)
const buttonGroups = [
  {title:'更多',action:'',children:[
    {title:'客户提现',action:()=>{addAction(3,1)}},
    {title:'供应商退款',action:()=>{addAction(7,3)}},
    {title:'经营收入',action:()=>{addAction(9,3)}},
    {title:'经营支出',action:()=>{addAction(11,3)}},
    {title:'工资发放',action:()=>{addAction(15,4)}},
    {title:'提成发放',action:()=>{addAction(17,4)}},
    {title:'内部转账',action:()=>{addAction(19,2)}},
    ]
  }
]
const buttonGroupsAfter = [
  {title:'审核',action:'',api:financialStatement.auditPass},
  {title:'反审核',action:'',api:financialStatement.auditRefuse},
]
let initForm = [
      {
        formType: 'grid-tailwind',
        colNumber: 1,
        cols: [
          {
            formList: [
              {dataIndex: "currency_type"},
              {dataIndex: "trade_account_id"},
              {dataIndex: "company_id"},
              {dataIndex: "user_id"},
              {dataIndex: "supplier_id"},
              {dataIndex: "customer_id"},
              {dataIndex: "amount"},
              {dataIndex: "service_charge"},
              {dataIndex: "service_charge_user"},
              {dataIndex: "company_account_id"},
              {dataIndex: "paytime"},
              {dataIndex: "check_no"},
              {dataIndex: "check_status"},
              {dataIndex: "check_memo"},
              {dataIndex: "remark"},
            ]
          }
        ]
      },
    ];
let userForm = [
  {
        formType: 'grid-tailwind',
        colNumber: 2,
        cols: [
          {
            formList: [
              // {dataIndex: "trade_account_id"},
              {dataIndex: "customer_id"},
              {dataIndex: "currency_type"},
              {dataIndex: "trade_bank"},
              {dataIndex: "trade_user_name"},
              {dataIndex: "trade_account_no"},
              {dataIndex: "amount"},
              {dataIndex: "service_charge"},
              {dataIndex: "service_charge_user"},
              {dataIndex: "company_account_id"},
              {dataIndex: "paytime"},
              {dataIndex: "check_no"},
              {dataIndex: "check_status"},
            ]
          },
          {
            formList: [
              {dataIndex: "check_memo"},
              {dataIndex: "remark"},
              {dataIndex: "is_invoice"},
              {dataIndex: "had_invoice"},
              {dataIndex: "fp"},
              {dataIndex: "ls"},
            ]
          }
        ]
      }, 
];

const addAction = (type,AccountType) => {
  columns[1].addDefaultValue = type
  changeType(type,AccountType)
  tradeType.value = type
  crudRef.value.addAction()
}
let UserField = ['trade_bank','trade_user_name','trade_account_no','is_invoice','had_invoice','fp','ls'];
function changeType(type,AccountType){
  if(type == 1){//客户充值
    options.formOption.layout = userForm
  }else{
    options.formOption.layout = initForm
  }
  getFormByType(AccountType)
}

function getFormByType(AccountType){
  for(let i = 0; i < columns.length; i++){
      if(columns[i].dataIndex == 'trade_account_id'){
        columns[i].dict.params.type = AccountType
      }
      if(UserField.includes(columns[i].dataIndex)){
        columns[i].addDisplay = AccountType == 1
        columns[i].editDisplay = AccountType == 1
      }

      if(['customer_id','supplier_id','user_id','company_id'].includes(columns[i].dataIndex)){
          if(AccountType == 1){
            columns[i].addDisplay = columns[i].dataIndex == 'customer_id'
            columns[i].editDisplay = columns[i].dataIndex == 'customer_id'
          }
          if(AccountType == 2){
            columns[i].addDisplay = columns[i].dataIndex == 'company_id'
            columns[i].editDisplay = columns[i].dataIndex == 'company_id'
          }
        
          if(AccountType == 3){
            columns[i].addDisplay = columns[i].dataIndex == 'supplier_id'
            columns[i].editDisplay = columns[i].dataIndex == 'supplier_id'
          }
        
          if(AccountType == 4){
            columns[i].addDisplay = columns[i].dataIndex == 'user_id'
            columns[i].editDisplay = columns[i].dataIndex == 'user_id'
          }
      }
    }
}

const options = reactive({
  id: 'financial_statement',
  pageLayout: 'fixed',
  rowSelection: {
    showCheckedAll: true
  },
  beforeAdd:function(data){
      data.check_status = data.check_status.length > 0 ? data.check_status[0] : 1
      data.trade_type = tradeType
      return data;
  },

  beforeOpenEdit:function(record){
    let AccountType;
    console.log(record.trade_type)
    if([1,3].includes(record.trade_type)){
      AccountType = 1
    }else if([5,7,9,11].includes(record.trade_type)){
      AccountType = 3
    }else if([15,17].includes(record.trade_type)){
      AccountType = 4
    }else{
      AccountType = 2
    }
    changeType(record.trade_type,AccountType)
    return true;
  },
  pk: 'id',
  operationColumn: true,
  operationColumnWidth: 160,
  formOption: {
    viewType: 'drawer',
    width: "80%",
    layout: userForm
  },
  tabs:{
    dataIndex: "trade_type",
    onChange: (value) => {
      value = parseInt(value)
      columns[2].hide = value != 1
      if([1,3].includes(value)){
        columns[5].title = '用户账户'
      }else if([5,7].includes(value)){
        columns[5].title = '供应商账户'
      }else if([15,17].includes(value)){
        columns[5].title = '员工账户'
      }else{
        columns[5].title = '公司账户'
      }
    },
  },
  api: financialStatement.getList,
  recycleApi: financialStatement.getRecycleList,
  add: {
    show: true,
    api: financialStatement.save,
    auth: ['finance:financialStatement:save']
  },
  edit: {
    show: true,
    api: financialStatement.update,
    auth: ['finance:financialStatement:update']
  },
  delete: {
    show: true,
    api: financialStatement.deletes,
    auth: ['finance:financialStatement:delete'],
    realApi: financialStatement.realDeletes,
    realAuth: ['finance:financialStatement:realDeletes']
  },
  recovery: {
    show: true,
    api: financialStatement.recoverys,
    auth: ['finance:financialStatement:recovery']
  },
  import: {
    show: true,
    url: 'finance/financialStatement/import',
    templateUrl: 'finance/financialStatement/downloadTemplate',
    auth: ['finance:financialStatement:import']
  },
  export: {
    show: true,
    url: 'finance/financialStatement/export',
    auth: ['finance:financialStatement:export']
  }
})

const columns = reactive([
  {
    title: "主键",
    dataIndex: "id",
    formType: "input",
    addDisplay: false,
    editDisplay: false,
    hide: true,
    commonRules: {
      required: true,
      message: "请输入主键"
    }
  },
  {
    title: "流水号",
    dataIndex: "fs_number",
    addDisplay: false,
    editDisplay: false,
    formType: "input",
    search: true,
  },
  {
    title: "用户",
    dataIndex: "user",
    formType: "select",
    addDisplay: false,
    editDisplay: false,
    dict: dicthelper.customer,
      hide:true
  },
  {
    title: "公司账户",
    dataIndex: "company_account_id",
    dict: {
      url: 'finance/financialAccount/list',
      props: {label: 'name', value: 'id'} ,
      params: {select: 'id,name',type:2},
      translation: true,
    }, 
    formType: "select",
    search: true,
    commonRules: {
      required: true,
      message: "请选择公司账户"
    }
  },
  {
    title: "交易类型",
    dataIndex: "trade_type",
    addDisplay: false,
    editDisplay: false,
    dict: {
      name: "TradeType",
      props: {
        label: "title",
        value: "key"
      },
      translation: true
      },
    formType: "select",
    search: true,
    hide:true,
    commonRules: {
      required: true,
      message: "请输入交易类型"
    }
  },
  {
    title: "交易账户",
    dataIndex: "trade_account_id",
    formType: "select",
    dict: {
        url: 'finance/financialAccount/list',
        props: {label: 'name', value: 'id'} ,
        params: {
          select: 'id,name'
        },
        translation: true,
      },  
    search: true,
    addDisplay:false,
    editDisplay:false,
    // hide:userShow,
    commonRules: {
      required: true,
      message: "请选择交易账户"
    }
  },
  {
    title: "客户",
    dataIndex: "customer_id",
    formType: "select",
    dict: dicthelper.customer,  
    hide: true,
    addDisplay:false,
    editDisplay:false,
    virtualListProps:{},
    commonRules: {
      required: true,
      message: "请选择用户"
    }
  },
  {
    title: "供应商",
    dataIndex: "supplier_id",
    formType: "select",
    dict: dicthelper.supplier,  
    hide: true,
    addDisplay:false,
    editDisplay:false,
    commonRules: {
      required: true,
      message: "请选择供应商"
    }
  },
  {
    title: "员工",
    dataIndex: "user_id",
    formType: "select",
    dict: dicthelper.user,  
    hide: true,
    addDisplay:false,
    editDisplay:false,
    commonRules: {
      required: true,
      message: "请选择员工"
    }
  },
  {
    title: "公司账户",
    dataIndex: "company_id",
    formType: "select",
    dict: {
      url: 'finance/financialAccount/list',
      props: {label: 'name', value: 'id'} ,
      params: {select: 'id,name',type:2},
      translation: true,
    }, 
    hide: true,
    addDisplay:false,
    editDisplay:false,
    commonRules: {
      required: true,
      message: "请选择员工"
    }
  },
  {
    title: "交易账户类型",
    dataIndex: "trade_account_type",
    formType: "select",
    addDisplay: false,
    editDisplay: false,
    hide: true,
    dict: {
      name: "FinancialAccountType",
      props: {
        label: "title",
        value: "key"
      },
      translation: true
    }
  },
  {
    title: "支付人",
    dataIndex: "trade_user_name",
    addDisplay: false,
    editDisplay: false,
    formType: "input",
    hide: true
  },
  {
    title: "支付银行",
    dataIndex: "trade_bank",
    addDisplay: false,
    editDisplay: false,
    dict: {
      name: "bank",
      props: {
        label: "title",
        value: "key"
      },
      translation: true
    },
    formType: "select",
    hide: true
  },
  {
    title: "支付账号",
    dataIndex: "trade_account_no",
    addDisplay: false,
    editDisplay: false,
    formType: "input",
    hide: true
  },
  {
    title: "交易方式",
    dataIndex: "pay_type",
    formType: "input",
    addDisplay: false,
    editDisplay: false,
    hide: true
  },
  {
    title: "币种",
    dataIndex: "currency_type",
    formType: "select",
    search: true,
    dict: {
      name: "currencyType",
      props: {
        label: "title",
        value: "key"
      },
      translation: true
      },
    commonRules: {
      required: true,
      message: "请输入币种"
    }
  },
  {
    title: "金额",
    dataIndex: "amount",
    formType: "input",
    commonRules: {
      required: true,
      message: "请输入金额"
    },
    // search: true
  },
  {
    title: "手续费",
    dataIndex: "service_charge",
    formType: "input",
    addDefaultValue: 0,
    // search: true
  },
  {
    title: "承担手续费",
    dataIndex: "service_charge_user",
    dict: {
      name: "ServiceChargeUser",
      props: {
        label: "title",
        value: "key"
      },
      translation: true
    },
    addDefaultValue: 0,
    formType: "radio",
    hide: true
  },
  {
    title: "需要发票",
    dataIndex: "is_invoice",
    addDisplay: false,
    editDisplay: false,
    formType: "switch",
    hide: true
  },
  {
    title: "发票已开",
    dataIndex: "had_invoice",
    addDisplay: false,
    editDisplay: false,
    formType: "switch",
    hide: true
  },

  {
    title: "审核流水号",
    dataIndex: "check_no",
    formType: "input",
    commonRules: {
      required: true,
      message: "请输入审核流水号"
    },
    addDisplay:false,
    editDisplay:false,
    search: true
  },
  {
    title: "审核状态",
    dataIndex: "check_status",
    addDefaultValue: 1,
    editDisplay:false,
    dict:{
      data: [
        {
          label: "审核通过",
          value: 4
        }
      ],
      translation: true
    },
    formType: "checkbox",
    // hide: true
  },
  {
    title: "审核备注",
    dataIndex: "check_memo",
    formType: "textarea",
    search: true
  },
  {
    title: "创建人",
    dataIndex: "created_by",
    formType: "select",
    dict: {
      url: 'system/user/list',
        props: {label: 'nickname', value: 'id'} ,
        params: {select: 'id,nickname'},
        translation: true,
      },  
    addDisplay: false,
    editDisplay: false,
  },
  {
    title: "创建人类型",
    dataIndex: "creator_type",
    formType: "input",
    addDisplay:false,
    editDisplay:false,
    hide: true
  },
  {
    title: "审核人",
    dataIndex: "checker",
    dict: {
      url: 'system/user/list',
        props: {label: 'nickname', value: 'id'} ,
        params: {select: 'id,nickname'},
        translation: true,
      },  
    addDisplay:false,
    editDisplay:false,
    formType: "select",
    hide: true
  },
  {
    title: "第三方单号",
    dataIndex: "third_no",
    formType: "input",
    addDisplay:false,
    editDisplay:false,
    hide: true
  },
  {
    title: "支付时间",
    dataIndex: "paytime",
    formType: "date",
    search: true,
    commonRules: {
      required: true,
      message: "请选择支付时间"
    },
    showTime: true
  },
  {
    title: "审核时间",
    dataIndex: "checktime",
    formType: "date",
    addDisplay:false,
    editDisplay:false,
    search: true,
    showTime: true
  },
  {
    title: "更新者",
    dataIndex: "updated_by",
    formType: "input",
    addDisplay: false,
    editDisplay: false,
    hide: true
  },
  {
    title: "创建时间",
    dataIndex: "created_at",
    formType: "date",
    addDisplay: false,
    editDisplay: false,
    showTime: true
  },
  {
    title: "更新时间",
    dataIndex: "updated_at",
    formType: "date",
    addDisplay: false,
    editDisplay: false,
    hide: true,
    showTime: true
  },
  {
    title: "删除时间",
    dataIndex: "deleted_at",
    formType: "date",
    addDisplay: false,
    editDisplay: false,
    hide: true,
    showTime: true
  },
  {
    title: "备注",
    dataIndex: "remark",
    formType: "textarea",
    hide: true
  },
  {
    title: "发票",
    dataIndex: "fp",
    formType: "upload",
    hide: true,
    onlyData: false,
    addDisplay: false,
    editDisplay: false,
    multiple: true,
    returnType: "url",
    type: "image"
  },
  {
    title: "流水",
    dataIndex: "ls",
    formType: "editor",
    formType: "upload",
    addDisplay: false,
    editDisplay: false,
    onlyData: false,
    multiple: true,
    returnType: "url",
    type: "image",
    hide: true
  }
])
provide('crudRef', crudRef)
</script>
<script> export default { name: 'finance:financialStatement' } </script>